<!--
 * @Author: WuFeng <763467339@qq.com>
 * @Date: 2024-11-08 14:08:42
 * @LastEditTime: 2024-11-08 17:01:04
 * @LastEditors: WuFeng <763467339@qq.com>
 * @Description: 
 * @FilePath: \markdown-magic\src\pages\ImgToBase64\page\entry\index.vue
 * Copyright 版权声明
-->
<template>
  <div class="pageWrap">
    <a-tabs v-model:activeKey="activeKey">
      <a-tab-pane key="ImgToBase64" tab="图片转base64">
        <ImgToBase64 />
      </a-tab-pane>
      <a-tab-pane key="Base64ToImg" tab="base64转图片">
        <Base64ToImg />
      </a-tab-pane>
    </a-tabs>
    <div class="descWrap">
      <h3>简介</h3>
      <p>
        Base64是一种通过64个可打印字符来表示二进制数据的编码方法。它在处理文本数据的场景中广泛应用，用于表示、传输和存储一些二进制数据，包括MIME电子邮件和XML中的复杂数据。
Base64编码对于图片数据尤其有用，它能够将一幅图片编码成一串字符串。通过使用这个字符串，我们可以在不依赖图片URL地址的情况下传递、存储和展示图片。这种方法在一些情境下非常方便，特别是当需要将图片嵌入到文本或其他数据格式中时。
通过Base64编码，图片数据被转换成易于处理的文本形式，为处理和传输提供了更大的灵活性。
      </p>
    </div>
  </div>
</template>

<script setup>
import ImgToBase64 from './ImgToBase64.vue'
import Base64ToImg from './Base64ToImg.vue'
import { ref, reactive } from 'vue'

const activeKey = ref('ImgToBase64')

</script>



<style lang="scss" scoped>
.pageWrap {
  .descWrap{
    margin-top: 16px;
    h3{
      font-size: 14px;
      font-weight: bold;
    }
    p{
      font-size: 14px;
      color: #666;
      line-height: 1.6em;
      text-indent: 2em;
    }
  }
}
</style>